Fix metadata values and separators display#5441
Conversation
There was a problem hiding this comment.
Pull request overview
This PR fixes the inline display of metadata values/separators (e.g., Keywords) by removing unnecessary Bootstrap flex layout classes from the metadata field wrapper, aligning behavior with pre-DSpace 10 rendering and addressing issue #5440.
Changes:
- Removed
d-flex flex-columnfrom the metadata field wrapper body to prevent values/separators from being forced onto separate lines. - Minor template formatting adjustments in
metadata-field-wrapper.component.html.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
| <div class="simple-view-element" [class.d-none]="hideIfNoTextContent && content.textContent.trim().length === 0"> | ||
| @if (label) { | ||
| <h2 class="simple-view-element-header">{{ label }}</h2> | ||
| <h2 class="simple-view-element-header">{{ label }}</h2> |
There was a problem hiding this comment.
The <h2> inside the @if (label) block is not indented under the block, which is inconsistent with the indentation used for @if blocks elsewhere (e.g. ds-select.component.html). Consider indenting the <h2> (and matching closing brace) to keep template formatting consistent and easier to read.
| <h2 class="simple-view-element-header">{{ label }}</h2> | |
| <h2 class="simple-view-element-header">{{ label }}</h2> |
There was a problem hiding this comment.
@jesielviana : It looks like copilot gave you a good review here. You've accidentally removed the indentation of this <h2> tag, which makes the code less readable. Could you restore that indentation please?
There was a problem hiding this comment.
Sorry about that. I’ve restored the indentation.
There was a problem hiding this comment.
👍 Thanks @jesielviana ! I tested this and verified this fixes the bug
I also verified this bug only impacts the main branch (i.e. not reproducible on 9.x)
References
Description
Removes unnecessary layout classes from the metadata field wrapper component to simplify the structure and avoid unintended styling behavior.
Instructions for Reviewers
This PR removes redundant Bootstrap flex classes that were not required and could interfere with layout rendering.
List of changes in this PR:
d-flexandflex-columnclasses from<div #content class="simple-view-element-body">in metadata-field-wrapper.component.htmlHow to verify:
Checklist
This checklist provides a reminder of what we are going to look for when reviewing your PR. You do not need to complete this checklist prior creating your PR (draft PRs are always welcome).
However, reviewers may request that you complete any actions in this list if you have not done so. If you are unsure about an item in the checklist, don't hesitate to ask. We're here to help!
mainbranch of code (unless it is a backport or is fixing an issue specific to an older branch).npm run lintnpm run check-circ-deps)package.json), I've made sure their licenses align with the DSpace BSD License based on the Licensing of Contributions documentation.